<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>目的地客流监测</title>
    <link rel="icon" type="image/x-icon" href="../../images/logo.png">
    <link rel="stylesheet" href="../../plugin/M_select/js/M_select/M_select.css">
    <link rel="stylesheet" href="../../css/reset.css">
    <link rel="stylesheet" href="../../css/common.css">
    <link rel="stylesheet" href="../../css/destination.css">
</head>

<body>
    <div class="box">
        <!-- 头部 -->
        <div class="header-box">
                <img src="../../images/headeBg.png" alt="">
                <div class="weather-box">
                    <span>郑州 小雨转多云 32/16℃</span>
                </div>
                <h1 class="header-title"><img src="../../images/header.png" alt=""></h1>
                <div class="header-action">
                    <span class="action-time"></span>
                    <a href="javascript:;">管理中心</a>
                    <a href="javascript:;">退出</a>
                </div>
            </div>
        <div class="main-box">
            <!-- 侧边导航 -->
            <ul class="aside-box">
                    <li>
                        <a href="../home.html">
                            <span>
                                <img class="aside-img" src="../../images/home.png" alt="">
                                <img class="aside-imgA " src="../../images/homeA.png" alt="">
                                首页
                            </span>
                        </a>
                    </li>
                    <li>
                        <a href="../surroundings/development.html">
                            <span>
                                <img class="aside-img" src="../../images/huanjing.png" alt="">
                                <img class="aside-imgA" src="../../images/huanjingA.png" alt="">
                                产业发展环境
                            </span>
                        </a>
                    </li>
                    <li>
                        <a href="../basic/basic.html">
                            <span>
                                <img class="aside-img" src="../../images/yaosu.png" alt="">
                                <img class="aside-imgA" src="../../images/yaosuA.png" alt="">
                                产业基础要素
                            </span>
                        </a>
                    </li>
                    <li class="active">
                        <a href="./destination.html">
                            <span>
                                <img class="aside-img" src="../../images/keliu.png" alt="">
                                <img class="aside-imgA" src="../../images/keliuA.png" alt="">
                                旅游客流监测
                            </span>
                        </a>
                    </li>
                    <li>
                        <a href="../productTesting/index.html">
                            <span>
                                <img class="aside-img" src="../../images/chanpin.png" alt="">
                                <img class="aside-imgA" src="../../images/chanpinA.png" alt="">
                                旅游产品监测
                            </span>
                        </a>
                    </li>
                    <li>
                        <a href="../enterprise/scenicMonitor.html">
                            <span>
                                <img class="aside-img" src="../../images/qiye.png" alt="">
                                <img class="aside-imgA" src="../../images/qiyeA.png" alt="">
                                旅游企业监测
                            </span>
                        </a>
                    </li>
                    <li>
                        <a href="../tourismProject/index.html">
                            <span>
                                <img class="aside-img" src="../../images/xiangmu.png" alt="">
                                <img class="aside-imgA" src="../../images/xiangmuA.png" alt="">
                                旅游项目监测
                            </span>
                        </a>
                    </li>
                    <li>
                        <a href="../brand/brand.html">
                            <span>
                                <img class="aside-img" src="../../images/pinpai.png" alt="">
                                <img class="aside-imgA" src="../../images/pinpaiA.png" alt="">
                                旅游品牌监测
                            </span>
                        </a>
                    </li>
                </ul>
            <!-- 主题内容 -->
            <div class="content-box ">
                <div class="content-nav-box">
                    <a href="./destination.html" class="active">目的地客流监测 </a>
                    <a href="./scenic.html"> 重点景区客流监测</a>
                    <a href="./hotel.html">酒店客流监测</a>
                    <a href="./travelservice.html">旅行社客流监测</a>
                </div>
                <!-- 主体 -->
                <div class="flex-chart-between">
                    <!-- 中间 -->
                    <div class="center-box">
                        <div class="center-header destination">
                            <!-- 四个角 -->
                            <i class="top"></i>
                            <i class="right"></i>
                            <i class="bottom"></i>
                            <i class="left"></i>
                            <div class="selected">
                                <div class="select-box">
                                    <select name="" id="select-sheng" class="sheng">
                                        <option value="">河南省</option>
                                        <option value="">湖南省</option>
                                        <option value="">四川省</option>
                                    </select>
                                </div>
                                <div class="select-box">
                                    <select name="" id="select-shi" class="shi">
                                        <option value="">郑州市</option>
                                        <option value="">焦作市</option>
                                        <option value="">洛阳市</option>
                                    </select>
                                </div>
                            </div>
                            <p>今日累计游客人数: <div class="numberStyle">24682015</div></p>
                        </div>
                        <div class="center-chart-box">
                            <div class="top">
                                <div>
                                    <div class="title-box flex-between-center">
                                        <h3>
                                            <img src="../../images/titile-img.png" alt="">
                                            客流同比
                                        </h3>
                                        <div class="tab-box">
                                            <a href="javascript:;" class="active">本周</a>
                                            <a href="javascript:;">一个月</a>
                                            <a href="javascript:;">自定义
                                                <input type="text" value="08-22">至<input type="text" value="08-28">
                                            </a>
                                        </div>
                                    </div>
                                    <div class="chart-box" id="chart3-1"></div>
                                </div>
                                <div>
                                    <div class="title-box">
                                        <h3>
                                            <img src="../../images/titile-img.png" alt="">
                                            客流环比
                                        </h3>
                                    </div>
                                    <div class="chart-box">
                                        <div  id="chart3-2-1"></div>
                                    <div class="chart-hd" id="chart3-2-2"></div>
                                    </div>
                                    
                                    <div class="change-box">
                                            <div class="line-box"></div>
                                            <ul>
                                                <li class="active">
                                                    <i></i>
                                                    <span>月度</span>
                                                </li>
                                                <li>
                                                    <i></i>
                                                    <span>年度</span>
                                                </li>
                                            </ul>
                                        </div>
                                </div>
                            </div>
                            <div class="bottom">
                                <div>
                                    <div class="title-box">
                                        <h3>
                                            <img src="../../images/titile-img.png" alt="">
                                            假日分析
                                        </h3>
                                    </div>
                                    <div class="chart-box">
                                        <div id="chart3-3-1"></div>
                                        <div id="chart3-3-2"></div>
                                    </div>
                                </div>
                                <div>
                                    <div class="title-box">
                                        <h3>
                                            <img src="../../images/titile-img.png" alt="">
                                            入境客流
                                        </h3>
                                    </div>
                                    <div class="chart-box" id="chart3-4"></div>
                                </div>
                            </div>

                        </div>
                    </div>
                    <!-- 右侧 -->
                    <div class="right-box">
                        <div>
                            <div class="title-box">
                                <h3>
                                    <img src="../../images/titile-img.png" alt="">
                                    游客画像
                                </h3>
                            </div>
                            <div class="chart-box">
                                <div class="top">
                                    <div id="chart3-5-1"></div>
                                    <div id="chart3-5-2"></div>
                                </div>
                                <div class="bottom">
                                    <div id="chart3-5-3"></div>
                                    <div id="chart3-5-4"></div>
                                </div>
                            </div>
                        </div>
                        <div>
                            <div class="title-box flex-between-center">
                                <h3>
                                    <img src="../../images/titile-img.png" alt="">
                                    来源省份
                                </h3>
                                <a href="javascript:;">全部导出</a>
                            </div>
                            <div class="chart-box" id="chart3-6"></div>
                        </div>
                        
                    </div>
                </div>

            </div>
        </div>

    </div>
    <script src="../../plugin/jquery-1.11.1.min.js"></script>
    <script src="../../plugin/ECharts/echarts.js"></script>
    <script src="../../plugin/ECharts/china.js"></script>
    <script src="../../plugin/M_select/js/M_select/M_select.js"></script>
    <script src="../../js/jquery.leoTextAnimate.js"></script>
    <script src="../../js/common.js"></script>
    <script src="../../js/destination.js"></script>
    <script>
      <!-- 数字 -->
      $('.numberStyle').leoTextAnimate({
        delay: 1000, //延时出现时间
        autorun: true, //是否自动运行
        fixed: [',', ':', '.'], //
        start: '0'
      });
    </script>
</body>

</html>
